<template>
    <div class="base-content">
        <TableComp :tableCols="tableCols" :tableData="tableData">
            <template #oper="scope">
                <el-button type="primary" size="small" @click="test(scope)">test</el-button>
            </template>
        </TableComp>
    </div>
</template>
<script setup lang="ts">
import TableComp from '@/components/TableComp.vue'
import TableColumnModel from '@/model/TableColumnModel';
const tableCols: Array<TableColumnModel> = [
    new TableColumnModel({ label: '日期', prop: 'date' }),
    new TableColumnModel({ label: '全名', prop: 'name' }),
    new TableColumnModel({ label: '姓', prop: 'firstname' }),
    new TableColumnModel({ label: '名', prop: 'lastname' }),
    new TableColumnModel({ label: '地址', prop: 'address', width: 250 }),
    new TableColumnModel({ label: '原址', prop: 'oriaddress', width: 250 })
]
const tableData = [
    {
        date: '2016-05-03',
        name: 'Tom',
        firstname: 'Tom',
        lastname: 'Tom',
        address: 'No. 189, Grove St, Los Angeles',
        oriaddress: 'No. 189, Grove St, Los Angeles',
    },
    {
        date: '2016-05-03',
        name: 'Tom',
        firstname: 'Tom',
        lastname: 'Tom',
        address: 'No. 189, Grove St, Los Angeles',
        oriaddress: 'No. 189, Grove St, Los Angeles',
    },
    {
        date: '2016-05-03',
        name: 'Tom',
        firstname: 'Tom',
        lastname: 'Tom',
        address: 'No. 189, Grove St, Los Angeles',
        oriaddress: 'No. 189, Grove St, Los Angeles',
    },
]
const test = (scope: any) => {
    console.log(scope.row.name)
}
</script>
